<template>
    <el-row :gutter="10"  style="float: left; margin-left: 10px;" v-for="item in item.data" >
        <el-col :span="4.3">
            <el-avatar shape="square" :size="100" :fit="fit" :src='item.imgUrl'
                style="width:112px;height: 150px;" />
        </el-col>
        <el-col :span="5">
            <div class="yidong">
                <p style="font-weight: bold; height: 60px;">{{ item.itemName }}</p>
              <p> {{ item.startDate }}</p>
              <p>{{ item.areaName }}</p>
              <p>¥ {{ item.minPrice }}起</p>
            </div>
        </el-col>
    </el-row>
</template>
<script setup>
    import { reactive } from 'vue'
import { postMultipleGetPopularSearch } from '../../utils/api'
const item = reactive({ data: [] });
async function search() {
  let { data } = await postMultipleGetPopularSearch();
  item.data.length = 0;
  item.data.push(...data.data);
}
search();
</script>
<style scoped>
.yidong {
    margin-top: -10px;
    width: 180px;
}
p {
  font-size: 12px;
  height: 13px;
  width: 156px;
}
</style>